<template>
    <view>
        <view class="box" v-for="(value,key) in userList">
            <view class="profile">
                <view class="info">
                    <u-avatar text="用" fontSize="18" bg-color="#c0c4cc" size="50"></u-avatar>
                    <view class="cbox" style="margin-left: 30rpx">
                        <u-text :text="value.nickname" bold size="16"></u-text>
                        <u-text text="租房偏好" size="12"></u-text>
                    </view>
                </view>
                <view class="tel" @click="paymentPhone(value.id)" v-if="parseInt(value.is_pay)===0">
                    <u-icon :customStyle="{paddingTop:10+'rpx',paddingLeft:20+'rpx'}" name="phone" size="22"></u-icon>
                    <u-text text="获取电话" size="14" bold></u-text>
                </view>

                <view class="tel" @click="callPhone(value.tel)" v-else>
                    <u-icon :customStyle="{paddingTop:10+'rpx',paddingLeft:20+'rpx'}" name="phone" size="22"></u-icon>
                    <u-text text="拨打电话" size="14" bold></u-text>
                </view>
            </view>
            <view class="fav">
                <view class="cbox" style="margin: 30rpx 30rpx 0 0">
                    <u-text text="租房类型" size="11"></u-text>
                    <u-text :text="value.lease_type === 1 ? '整租' : '合租'" bold size="13"></u-text>
                </view>

                <view class="cbox" style="margin: 30rpx 30rpx 0 0">
                    <u-text text="价格偏好" size="11"></u-text>
                    <u-text :text="value.price_start + '-' + value.price_end + '元'" bold size="13"></u-text>
                </view>

                <view class="cbox" style="margin: 30rpx 30rpx 0 0">
                    <u-text text="小区偏好" size="11"></u-text>
                    <u-text :text="value.d_name" bold size="13"></u-text>
                </view>

                <view class="cbox" style="margin: 30rpx 30rpx 0 0" v-if="value.room_types">
                    <u-text text="房屋户型" size="11"></u-text>
                    <u-text :text="value.room_types" bold size="13"></u-text>
                </view>

                <view class="cbox" style="margin: 30rpx 30rpx 0 0" v-if="value.claim">
                    <u-text text="特殊需求" size="11"></u-text>
                    <u-text :text="value.claim" bold size="13"></u-text>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        name: "UserList",
        props: {
            userList: {
                type: Array
            },
        },
        methods:{
            paymentPhone(id){
                uni.showLoading({title: '正在加载'});
                uni.$u.http.post('/api.php/Pay/client_pay', {u_id:uni.getStorageSync('u_id'),client_id:id}).then(res => {
                    uni.hideLoading();

                    if (res === '') {
                        console.log(res);
                        return;
                    }else{
                        let payment ={
                            provider: 'wxpay',
                            orderInfo:'测试信息',
                            appId: res.appId,
                            timeStamp: res.timeStamp,
                            nonceStr: res.nonceStr,
                            package: res.package,
                            signType: res.signType,
                            paySign: res.paySign,
                            success:function () {
                                uni.showToast({
                                    title: '支付成功', //提示文字
                                    duration: 2000, //显示时长
                                    icon: "success", //图标，支持"success"、"loading"
                                });
                                uni.$emit('refresh', {refresh: true});
                            },
                            fail:function () {
                                uni.showToast({
                                    title: '支付失败',
                                    duration: 2000,
                                    icon: "error",
                                });
                            }
                        };
                        uni.requestPayment(payment);
                    }
                });
            },
            callPhone(tel){
                uni.makePhoneCall({
                    phoneNumber: tel.toString()
                });
            }
        }
    }
</script>

<style lang="scss" scoped>
    .box{
        @include flex(column);
        border-bottom: 1rpx solid #eee;
        padding-bottom: 30rpx;
        padding-top: 30rpx;
    }

    .profile{
        @include flex(row);
        justify-content: space-between;
    }
    .info{
        @include flex(row);
        justify-content: flex-start;
        align-items: center;
    }
    .cbox{
        @include flex(column);
    }
    .fav{
        @include flex(row);
        justify-content: flex-start;
        flex-wrap: wrap;
    }
</style>